.app-container {
  margin-bottom: 30px;
}

.app-container.page-shop-edit {
  font-size: 14px;
  color: #333;

  .head-title {
    margin-bottom: 15px;
  }

  .txt {
    width: 100%;
  }

  .red-tag-txt {
    color: #ff4949;
  }

  // 导航栏
  .nav-box {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;

    .nav {
      position: relative;
      display: flex;
      white-space: nowrap;

      .nav-item {
        margin: 0;
        font-size: 14px;
        line-height: 1em;
        padding: 15px 20px;
        color: #333;
        cursor: pointer;
      }

      .nav-item.active {
        color: #155BD4;
        border-radius: 4px 4px 0 0;
        border-bottom: 2px solid #155bd4;
      }
    }
  }

  .nav-box::before {
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0;
    border-bottom: 1px solid #f0f0f0;
    content: '';
  }

  .shop-info-box {

    // 公共
    p {
      margin: 0;
    }

    p.tit {
      display: inline-block;
      text-align: right;
    }

    .txt-bold {
      color: #333;
    }

    .asterisk {
      color: red;
      padding-right: 5px;
    }

    .table-box {
      display: block;
      width: 100%;
      margin: 20px 0;

      &:deep(.el-table th),
      .el-table td {
        border-color: #f0f0f0;
      }

      &:deep(.el-table__body-wrapper) {
        max-height: 245px;
        overflow-y: scroll;
        scrollbar-width: none;
        /* Firefox */
        -ms-overflow-style: none;
        /* IE 10+ */
      }

      &:deep(.el-table__body-wrapper::-webkit-scrollbar) {
        display: none;
        /* Chrome Safari */
      }

      &:deep(.el-table__body) {
        width: 100%;
      }
    }

    // 图片框大小统一
    &:deep .plugin-images {
      display: block;
      width: auto;
      height: 130px;

      img {
        vertical-align: top;
      }
    }

    &:deep(.el-upload--picture-card),
    &:deep(.el-upload-list--picture-card .el-upload-list__item) {
      width: 130px;
      height: 130px;
      line-height: 130px;
      margin: 0;
    }

    &:deep(.el-upload-list--picture-card) {
      display: block;
      width: auto;
      height: 100%;
    }

    // 表单项下间距
    .ci-wrapper,
    .basic-info-box {
      .el-form-item {
        margin-bottom: 30px;
      }
    }

    .license-content {
      display: flex;
    }

    // 图片示例
    .upload-example {
      display: flex;
      min-width: 260px;
      margin-left: 150px;

      .example-box {
        margin-left: 0;

        &:nth-child(2) {
          margin-left: 30px;
        }
      }
    }

    // 示例框
    .example-box {
      position: relative;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 130px;
      height: 130px;
      background: #FFFFFF;
      border: 1px solid #EAEAEA;
      border-radius: 3px;
      box-sizing: border-box;
      margin-left: 30px;

      img {
        display: block;
        width: auto;
        max-width: 100%;
        height: auto;
        max-height: 100%;
      }

      .tips {
        position: absolute;
        left: -1px;
        bottom: 0;
        width: 130px;
        height: 20px;
        line-height: 20px;
        font-size: 12px;
        color: #fff;
        background: rgba(51, 51, 51, 0.5);
        text-align: center;
        border-radius: 0 0 3px 3px;
      }
    }

    // 图片
    .tab-img {
      width: 60px;
      height: 60px;
      margin-right: 5px;
      cursor: pointer;
    }

    // 表格上的标题
    .table-data-title {
      display: flex;
      align-items: center;

      .text {
        font-size: 16px;
        min-width: 80px;

        .stress {
          color: #FF2120;
          padding-right: 5px;
        }
      }

      .tips {
        font-size: 12px;
        color: #999;
        margin-left: 10px;
      }

      .edit-btn {
        margin-left: auto;
        cursor: pointer;
      }
    }

    // 基本信息模块
    .basic-info-mod {

      // 审核状态
      .audit-status {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        background: #f7f8fa;
        padding: 20px;
        line-height: 1em;
        margin-top: 20px;
        color: #333;

        p.tit {
          width: 95px;
        }

        .week {
          color: #666;
        }
      }

      .addr-select {
        display: block;
        width: 100%;
      }

      .bg-img {
        display: flex;
        justify-content: flex-start;

        .business-license-box {
          margin-right: 30px;

          .img-tips {
            display: block;
            text-align: center;
            font-size: 12px;
            color: #666;
            line-height: 1.5em;
            margin-top: 8px;

            p {
              margin: 0;
              padding: 0;
            }
          }
        }
      }

      .id-box {
        margin-bottom: 20px;

        .upload-content {
          .upload-img {
            display: flex;
            align-items: center;
            justify-content: flex-start;

            &:deep(.el-form-item) {
              margin-bottom: 10px;
            }

            div {
              &:nth-child(2) {
                margin-left: 30px;
              }
            }

            .disabled-upload {
              &:deep(.el-upload) {
                background: #f5f7fa;
              }
            }
          }

          .upload-img.en-upload-img {
            &:deep(.el-form-item.is-error) {
              margin-bottom: 45px;
            }
          }

          .upload-img.zh-upload-img {
            &:deep(.el-form-item.is-error) {
              margin-bottom: 22px;
            }
          }
        }

        .upload-tips {
          margin-left: 150px;
        }
      }

      // 信息
      .basic-info-list {
        margin-top: 30px;

        .basic-info-box {
          display: flex;
          justify-content: flex-start;
          width: 100%;
          :deep(.el-upload-list__item){
            img{
              object-fit: cover;
            }
          }
          .left-info {
            width: 40%;
            min-width: 300px;
            margin-right: 80px;
            text-align: left;
          }

          .right-info {
            width: 45%;
            min-width: 300px;
          }
        }

        .basic-info-item {
          display: flex;
          align-items: center;
          justify-content: flex-start;
          padding: 20px 30px;
        }

        .upload-tips {
          font-size: 12px;
          color: #999;
          height: auto;
          line-height: 1.5em;
          margin-top: 5px;
        }
      }

      .foot-btn {
        margin-left: 120px;
      }
    }

    // 工商信息
    .business-info-mod {
      margin-top: 30px;

      .ci-wrapper {
        display: flex;
        justify-content: flex-start;
        width: 100%;

        .capital-int {
          &:deep(.el-input__inner) {
            padding-right: 0 !important;
            border-radius: 2px 0 0 2px !important;
          }
        }

        &:deep(.el-date-editor.el-input),
        &:deep(.el-date-editor.el-input__inner) {
          width: 100%;
        }

        &:deep(.el-date-editor .el-range-separator) {
          width: auto !important;
        }

        .left-info {
          width: auto;
          min-width: 500px;
          max-width: 40%;

          .btn-box {
            display: flex;
            margin-left: 134px;
            margin-bottom: 40px;

            .prev-btn {
              margin-right: 13px;
            }
          }
        }

        .right-info {
          width: 45%;
          min-width: 300px;
          max-width: 500px;
          margin-left: 30px;

          .business-license-box {
            .license-content {
              display: flex;
            }
          }

          .upload-img-box {
            position: relative;

            .mask {
              position: absolute;
              background-color: rgba($color: #000000, $alpha: 0);
            }
          }

          .idcard:nth-child(2) {
            .upload-img-box {
              margin-left: 20px;
            }
          }

          .id-box {
            .upload-content {
              .upload-img {
                display: flex;
              }

              .upload-example {
                display: flex;
                margin-left: 150px;

                .example-box {
                  margin-left: 0;
                  padding: 5px;
                  .tips {
                    padding: 0 5px;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                  }

                  &:nth-child(2) {
                    margin-left: 20px;
                  }
                }
              }

              .upload-tips {
                margin-left: 150px;
              }
            }
          }

          .img-static {
            display: block;
            width: 120px;
            height: 120px;
          }

          .img-static:not(:first-child) {
            margin-left: 20px;
          }

          // 示例框
          .example-box {
            position: relative;
            display: flex;
            justify-content: center;
            align-items: center;
            width: 120px;
            height: 120px;
            background: #FFFFFF;
            border: 1px solid #EAEAEA;
            border-radius: 3px;
            box-sizing: border-box;
            margin-left: 20px;

            img {
              display: block;
              width: auto;
              max-width: 100%;
              height: auto;
              max-height: 100%;
            }

            .tips {
              position: absolute;
              left: -1px;
              bottom: 0;
              width: 120px;
              height: 20px;
              line-height: 20px;
              font-size: 12px;
              color: #fff;
              background: rgba(51, 51, 51, 0.5);
              text-align: center;
              border-radius: 0 0 3px 3px;
            }
          }

          .upload-tips {
            font-size: 12px;
            color: #999;
            height: auto;
            line-height: 1.5em;
            margin-top: 10px;
          }

          // 图片上传框样式修改
          &:deep(.el-upload) {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 120px;
            height: 121px;
            background: #FFFFFF;
            border: 1px solid #EAEAEA;
            border-radius: 3px;
            box-sizing: border-box;

            .el-icon-plus {
              font-size: 22px;
              color: #EAEAEA;
            }
          }
        }
      }

      .foot-btn {
        margin-left: 150px;
      }

      .en-foot-btn {
        margin-left: 200px;
      }
    }

    // 签约信息
    .contract-info {
      width: 100%;
      margin-top: 30px;
      margin-bottom: 80px;

      .s-item {
        .si-content {
          margin-top: 12px;

          .img-box {
            display: flex;
            align-items: center;

            img {
              // 固定宽高
              width: 57px;
              height: 57px;
            }

            img:not(:last-child) {
              margin-right: 5px;
            }
          }
          .contract-time-box{
            display: flex;
            align-items: center;
            .end-time {
              position: relative;
              .text {
                position: absolute;
                left: 30px;
                line-height: 32px;
                font-size: 14px;
              }
            }
          }

          .brand-logo {
            display: flex;
            align-items: flex-start;

            img {
              // 固定宽高
              width: 57px;
              height: 57px;
            }

            img:not(:last-child) {
              margin: 5px;
            }
          }
        }

        .table-con {
          padding: 0;
        }
      }

      .s-brand-item {
        margin: 50px 0 40px;
      }

      .s-sign-item {
        margin-bottom: 30px;
      }

      table {
        .table-item {
          .img-item {
            img {
              vertical-align: middle;
              width: 38px;
              height: 38px;
              background: #EBF1FF;
              border-radius: 19px;
              margin: auto;
            }
          }
        }
      }

      .btn-box {
        display: flex;
        justify-content: center;
        margin-bottom: 39px;

        .prev-btn {
          margin-right: 13px;
        }
      }

      &:deep(.el-range-editor.el-input__inner) {
        width: auto;
      }
    }

    // 财务信息
    .financial-info {
      margin: 30px 0;

      .table-data-title {
        margin-bottom: 20px;
      }

      .table-box {
        margin-top: 10px;

        &:deep(.el-table__body-wrapper) {
          height: auto;
          max-height: 100%;
        }
      }
    }

  }

  // 地图
  .map {
    width: 100%;
    height: 300px;
  }
}

:deep(.plugin-images .el-upload-list .el-upload-list__item) {
  width: 120px;
  height: 120px;
}

:deep(.el-upload-list--picture-card .el-upload-list__item) {
  margin-right: 0;
}

.end-time {
  position: relative;

  .text {
    position: absolute;
    left: 30px;
  }
}
